<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<%@ include file="/views/common/resources.jsp" %>         
<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>定位服务</title>
    <link href="${basePath}resources/js/common/plugin/zTree/zTreeStyle.min.css" rel="stylesheet">
    <link rel="stylesheet" type="text/css" href="${basePath}resources/js/common/plugin/dhtmlxGrid/dhtmlxgrid.css"/>
    <script type="text/javascript" src="http://webapi.amap.com/maps?v=1.3&key=d782d52560e7b77e0d764b1496c60dde&plugin=AMap.Geocoder"></script>
	<script src="${basePath}resources/js/common/plugin/zTree/jquery.ztree.all-3.5.js"></script>
	<!-- dhtmlxGrid -->
	<script src="${basePath}resources/js/common/plugin/dhtmlxGrid/dhtmlxgrid.js"></script>
</head>
<body class="index">
<div class="page">		
	<%@ include file="/views/common/top.jsp" %> 
    <div class="main ">
        <div class="slider pa clearfix">
       		<%@ include file="/views/common/menu.jsp" %> 
            <div class="tree-warp fl">
                <div class="search pr">
                    <input class="search-input" type="text" value="" placeholder="请输入查询关键字">
                    <a class="search-btn pa" href="javascript:;"><i class="icon icon-search"></i></a>
                </div>
                <div class="tree-div">
                    <div class="tree-title clearfix pr">
                        <div class="tree-title-list all-car fl"><a class="active" href="javascript:;" title="全部车辆" >全部车辆</a></div>
                        <div class="tree-title-list result fl"><a  href="javascript:;" title="查询结果" >查询结果</a></div>
                        <div class="tree-title-line pa"></div>
                    </div>
                    <div class="tree-cont">
                        <div class="tree tree-cont-list">
                            <ul class="ztree" id="carTreeList"></ul>
                        </div>
                        <div class="result tree-cont-list dn">
                            <div id="vehicleSeachTable"></div>
                        </div>
                    </div>
                </div>
                <div class="car-details pr">
                    <div class="car-num"></div>
                    <div class="car-btn-hide pa"><span class="icon icon-hide"></span></div>
                    <div class="car-details-tab clearfix">
                        <div class="car-details-title fl">
                            <ul>
                                <li class="car-details-title-list active"><a class="db" href="javascript:" title="实时">实时</a></li>
                                <li class="car-details-title-list"><a class="db" href="javascript:" title="基础">基础</a></li>
                                <li class="car-details-title-list"><a class="db" href="javascript:" title="拍照">拍照</a></li>
                                <li class="car-details-title-list"><a class="db" href="javascript:" title="指令">指令</a></li>
                            </ul>
                        </div>
                        <div class="car-details-tab-cont fl">
                            <div class="car-details-cont-list dn active">
                                <p class="p1 clearfix"><span class="fl">速度：</span><span class="car-sd fl car-ont"></span></p>
                                <p class="p1 clearfix"><span class="fl">里程：</span><span class="car-millage fl car-ont"></span></p>
                                <p class="p1 clearfix"><span class="fl">时间：</span><span class="car-time fl car-ont"></span></p>
                                <p class="p1 clearfix"><span class="fl">状态：</span><span class="car-staue fl car-ont textOverFlow"></span></p>
                                <p class="p1 clearfix"><span class="fl">地址：</span><span class="car-address fl textOverFlow car-ont" id="caraddress"></span></p>
                                <p class="p1"><button class="car-video" >视频监控</button><button class="car-track">视频回放</button></p>
                            </div>
                            <div class="car-details-cont-list dn">
                                <p class="p1 clearfix"><span class="fl">企业：</span><span class="car-workunit fl car-ont"></span></p>
                                <p class="p1 clearfix"><span class="fl">车队：</span><span class="car-vehicleteam fl car-ont"></span></p>
                                <p class="p1 clearfix"><span class="fl">司机：</span><span class="car-driver fl car-ont"></span></p>
                                <p class="p1 clearfix"><span class="fl">电话：</span><a class="car-phone fl car-ont"></a></p>
                                
                            </div>
                            <div class="car-details-cont-list dn">
                                <div class="select-div">
                                    <select class="select-phone" id="selectChannel">
                                        <option value="1">通道1</option>
                                        <option value="2">通道2</option>
                                        <option value="3">通道3</option>
                                        <option value="4">通道4</option>
                                        <option value="5">通道5</option>
                                        <option value="6">通道6</option>
                                    </select>
                                    <select class="select-phone" id="selectSize">
                                     	<option value="1">320*240</option>
                                        <option value="2">640*480</option>       
                                    </select>
                                </div>
                                <a class="db phone-btn" href="javascript:;">拍照</a>
                                <div class="detail-img pr">
                                    <img src="${basePath}resources/images/index/phone.jpg" id="photo">
                                    <div class="look-bigimg pa"><a class="look-bigimg-icon" href="javascript:;"></a></div>
                                </div>
                            </div>
                            <div class="car-details-cont-list dn">
                                <div class="clearfix">
                                    <label class="fl label-order">常用:</label>
                                    <select class="sleect-order fl">
                                        <option>文本下发</option>
                                    </select>
                                </div>
                                <div class="clearfix">
                                    <label class="label-order fl">内容:</label>
                                    <textarea class="textarea-order fl"></textarea>
                                </div>
                                <a class="btn-order db" href="javascript:;">下发指令信息</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="content pr">
            <div class="map pr">
                <div id="mymap"></div>
                <div id="toolTopDiv">
					<div class="findDiv">
						<div class="list t11" id="listMap" title="我的地图">&nbsp;</div>
					</div>
					<div class="toolDiv">
						<div class="list t6" title="测距" id="distanceLi">&nbsp;</div>
						<div class="list t8" title="路况" id="mTrafficLi">&nbsp;</div>
						<div class="list t9" title="全屏" id="mapAllLi">&nbsp;</div>
					</div>
				</div>
            </div>
            <div id="nResizeMoveDiv" class="butDragMove" style=""></div>
            <div id="nResizeDiv" class="butDrag" title="拖拽" style=""> <p> 拖拽</p></div>
            <div class="car-staues clearfix pa">
                <ul class="car-staues-ul clearfix fl">
                    <li class="car-staues-list all-staues fl clearfix">
                        <a class="db" href="javascript:;">
                            <div class="staues-icon fl all-icon"></div>
                            <div class="fl">全部</div>
                            <div class="fl all-num">0</div>
                        </a>
                    </li>
                    <li class="car-staues-list run-staues fl clearfix">
                        <a class="db" href="javascript:;">
                            <div class="staues-icon fl run-icon"></div>
                            <div class="fl">运行</div>
                            <div class="fl run-num">0</div>
                        </a>
                    </li>
                    <li class="car-staues-list stop-staues fl clearfix">
                        <a class="db" href="javascript:;">
                            <div class="staues-icon fl stop-icon"></div>
                            <div class="fl">停车</div>
                            <div class="fl stop-num">0</div>
                        </a>
                    </li>
                    <li class="car-staues-list dropped-staues fl clearfix">
                        <a class="db" href="javascript:;">
                            <div class="staues-icon fl dropped-icon"></div>
                            <div class="fl">掉线</div>
                            <div class="fl dropped-num">0</div>
                        </a>
                    </li>
                </ul>
                <div class="export fl" style="display:none;" id="cancel">
                    <span class="icon icon-cancel" ></span>
                </div>
                <div class="export fl">
                    <span class="icon icon-export"></span>
                </div>
            </div>
            <div class="monitor-detail">
                 <div id="gridbox" style="height:100%;width:100%;background-color:white;"></div>
            </div>
        </div>
    </div>
</div>

<div class="detail-more pa dn">
    <a class="close-detail-more pa" href="javascript:;" title="关闭"></a>
    <ul>
        <li class="playbackurl"><a href="#" title="轨迹回放">轨迹回放</a></li>
        <li class="videourl"><a href="#" title="实时视频">实时视频</a></li>
        <li class="monitorurl"><a href="#" title="多车定位">多车定位</a></li>
        <li class="multivideourl"><a href="#" title="多车视频">多车视频</a></li>
    </ul>
</div>
<div id="ajax-loading">
    <img id="msgLoadImg" alt="" src="${basePath}resources/images/main/big_loading.gif">
    <span id="msgSpan">正在拼命加载,请稍候!</span>
</div>
<div class="lager-img pa dn">
    <a class="close-pop pa" href="javascript:" title="关闭"></a>
    <div>
        <img id="popimg" src="">
    </div>
</div>
	<script src="${basePath}resources/js/common/main/HashMap.js"></script>
	<script src="${basePath}resources/js/common/main/global.js"></script>
	<script src="${basePath}resources/js/common/main/mapToop.js"></script>
	<script src="${basePath}resources/js/common/main/nav.js"></script>
	<script src="${basePath}resources/js/business/gis/jqmonitor.js"></script>
</body>
</html>